<template>
    <div class="goods-info">
        <div class="goods-info-main">
            <div class="goods-name">{{goodsInfo.title}}</div>
            <div class="goods-detail">{{goodsInfo.title_sub}}</div>
            <div
                class="goods-member-price"
                v-if="goodsType == 1 || goodsType == 3"
            ><span>￥{{goodsInfo.price_market | currency}}</span></div>
            <div
                class="goods-member-price"
                v-if="goodsType == 0"
            >会员价：<span>￥{{goodsInfo.price_0 | currency}}</span></div>
            <div
                class="goods-market-price"
                v-if="goodsType == 0"
            >零售价：<span>￥{{goodsInfo.price_market | currency}}</span></div>
        </div>
        <img
            class="share-btn"
            src="@/assets/images/goodsDetail/share-icon.png"
            @click="share"
        />
    </div>
</template>

<script>
export default {
    name: 'GoodsInfo',
    props: ['goodsInfo', 'goodsType', 'userInfo'],
    methods: {
        goExperience() {
            this.$router.push('/experience')
        },
        share() {
            this.$emit('shareShow')
        }
    },
    filters: {
        currency(value) {
            return parseFloat(value / 100).toFixed(2)
        }
    }
}
</script>

<style lang="stylus" scoped>
.goods-info
    position relative
    padding 0.48rem 0.4rem
    background #fff
    display flex
    align-items flex-start
    .goods-info-main
        flex 1
        .goods-name
            font-size 0.48rem
            color #131313
            line-height 1.5
        .goods-detail
            margin-top 0.13rem
            font-size 0.37rem
            color #888
            line-height 1.5
        .exchange-point
            font-size 0.38rem
            color #d7463c
        .goods-member-price
            margin-top 0.67rem
            font-size 0.35rem
            color #131313
            span
                font-size 0.51rem
                color #d7463c
        .goods-market-price
            margin-top 0.33rem
            font-size 0.35rem
            color #888
            span
                font-size 0.37rem
                color #cecece
    .share-btn
        width 0.58rem
        margin-left 0.2rem
        .goods-price-num
            display flex
            align-items baseline
            margin-top 0.46rem
            .goods-price
                font-size 0.55rem
                color #d7463c
                .symbol
                    font-size 0.44rem
            .goods-num
                font-size 0.33rem
                color #979797
                margin-left 0.31rem
    .join-btn-box
        display flex
        align-items center
        margin-top 0.38rem
        padding 0.3rem
        background #d7463c
        border-radius 3px
        .join-info
            flex 1
            text-align center
            line-height 1.5
            font-size 0.32rem
            color #fff
            box-sizing border-box
        .join-btn
            width 30%
            line-height 0.8rem
            text-align center
            font-size 0.42rem
            background #fff
            color #d7463c
            border-radius 3px
            box-sizing border-box
</style>


